<script setup>
import {ref} from "vue";
import {ElMessage} from "element-plus";

const oldPassword = ref('1111111');
const newPassword = ref('');
const conPassword = ref('');

const save =()=>{
  if(newPassword.value!==conPassword.value){
    ElMessage.error('两次密码不一致，请重新输入！');
  }else{
    ElMessage.success('修改成功！');
  }
}

</script>

<template>
  <h3>{{ oldPassword === '' ? '设置密码' : '修改密码' }}</h3>
  <hr>
  <el-form label-width="100px" style="width: 500px;margin-top: 50px;height: 100%;">
    <el-form-item label="当前密码">
      <el-input type="password" v-model="oldPassword">{{oldPassword}}</el-input>
    </el-form-item>
    <el-form-item label="新密码">
      <el-input type="password" v-model="newPassword"></el-input>
    </el-form-item>
    <el-form-item label="确认密码">
      <el-input type="password" v-model="conPassword"></el-input>
    </el-form-item>
    <el-button type="danger" round style="width: 80px;margin-left: 200px;" @click="save()">保存</el-button>
  </el-form>
</template>

<style scoped>

</style>